{{ template "head" .Global}}


<div id="table-datatables">
    <h4 class="header">{{.Global.UrlName}} <a href="#addtemplate"
                               class="btn dropdown-button waves-effect waves-light modal-trigger"
                               style="float:right">添加项目</a>
    </h4>
</div>

<!--DataTables example-->
<div id="table-datatables">
    <div class="row">
        <div class="col s12 m12 l12">
            <table id="data-table-simple" class="responsive-table display" cellspacing="0">
                <thead>
                <tr>
                    <th>项目名称</th>
                    <th>类型</th>
                    <th>部署服务器</th>
                    <th>添加时间</th>
                    <th>部署</th>
                    <th>删除</th>
                </tr>
                </thead>
                <tbody>
                {{ range $k,$v :=$.Project}}
                <tr>
                    <td>{{$v.project_name}}</td>
                    <td>{{ $v.type }}</td>
                    <td>{{ $v.server_name }}</td>
                    <td>{{ $v.add_time }}</td>
                    <td><a class="btn dropdown-button waves-effect waves-light" onclick="deploy_project({{$v.project_name}})">部署</a></td>
                    <td onclick="delpoy_post_project_del(this,{{$v.id}})">
                        <a href="#" class="btn dropdown-button waves-effect waves-light ">删除</a>
                    </td>
                </tr>
                {{ end }}
                </tbody>
            </table>
        </div>
    </div>
</div>

<script type="text/javascript">
    function showDiv(hostname) {
        jQuery(jQuery('#nodecmd'));
        document.getElementById("cmd_hostname").value = hostname,
            alert(hostname);
    }
</script>

</div>
<!-- Floating Action Button -->
<div class="fixed-action-btn" style="bottom: 50px; right: 19px;">
    <a class="btn-floating btn-large">
        <i class="mdi-action-stars"></i>
    </a>
    <ul>
        <li><a href="css-helpers.html" class="btn-floating red"><i
                class="large mdi-communication-live-help"></i></a></li>
        <li><a href="app-widget.html" class="btn-floating yellow darken-1"><i
                class="large mdi-device-now-widgets"></i></a></li>
        <li><a href="app-calendar.html" class="btn-floating green"><i
                class="large mdi-editor-insert-invitation"></i></a></li>
        <li><a href="app-email.html" class="btn-floating blue"><i class="large mdi-communication-email"></i></a>
        </li>
    </ul>
</div>
<!-- Floating Action Button -->
</div>
<!--end container-->

</section>
<!-- END CONTENT -->

<div id="addtemplate" class="modal">
    <form role="form">
        <div class="modal-content">
            <div class="row">
                <p>
                    <strong>添加部署项目</strong>
                </p>
            </div>
            <div class="row">

                <div class="input-field col s6">
                    <input type="text" name="add_project_name" id="add_project_name" >
                    <label for="add_project_name">项目名称</label>
                </div>
                <div class="input-field col s6">
                    <label></label>
                    <select name="add_project_type" id="add_project_type">
                        <option value="" disabled selected>项目类型</option>
                        <option value="java">java</option>
                        <option value="tomcat">tomcat</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div>选择需要部署主机</div>
                {{ range $k,$v :=$.HostList}}
                {{ if eq $k  0}}
                <div class="input-field col s4">
                {{ end }}
                    {{ if eq $k  11 21 31 41 51 61 71 80 91 111 121 131}}
                    </div>
                    <div class="input-field col s4">
                        {{ end }}
                    <p>
                        <input type="checkbox" id="{{$v.id}}" name="server_name" value="{{$v.id}}"/>
                        <label for="{{$v.id}}">{{$v.id}}</label>
                    </p>
                {{ end }}
                    </div>
            </div>
        </div>

        <div class="modal-footer">
            <a class="waves-effect waves-red btn-flat modal-action modal-close">关闭</a>
            <a class="waves-effect waves-green btn-flat modal-action" onclick="delpoy_post_project_add()">
                保存
            </a>
        </div>
    </form>
</div>

<div id="salt_template_txt" class="modal">
    <form role="form">
        <div class="modal-content">
            <div class="row">
                <p><strong>模板ID：</strong> <a id="salt_template_id" name="salt_template_id">999999</a></p>
                <p><strong>模板名称：</strong> <a id="salt_template_name" name="salt_template_name"></a></p>
            </div>
            <div class="row">
                <div class="input-field col s12">
                   <textarea style="height: 430px" rows="50" type="text" id="template_txt"
                             name="template_txt" length="12000">
                   </textarea>
                </div>
            </div>

        </div>

        <div class="modal-footer">
            <a class="waves-effect waves-red btn-flat modal-action modal-close">关闭</a>
            <a class="waves-effect waves-green btn-flat modal-action" onclick="post_salt_template_txt()">
                保存
            </a>
        </div>
    </form>
</div>

{{ template "foot" .Global}}
<script type="text/javascript" src="/statics/js/function.js"></script>
<!-- jQuery Library -->
<script type="text/javascript" src="/statics/js/plugins/jquery-1.11.2.min.js"></script>
<!--materialize js-->
<script type="text/javascript" src="/statics/js/materialize.min.js"></script>
<!--prism-->
<script type="text/javascript" src="/statics/js/plugins/prism/prism.js"></script>
<!--scrollbar-->
<script type="text/javascript" src="/statics/js/plugins/perfect-scrollbar/perfect-scrollbar.min.js"></script>
<!-- data-tables -->
<script type="text/javascript" src="/statics/js/plugins/data-tables/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/statics/js/plugins/data-tables/data-tables-script.js"></script>
<!-- chartist -->
<script type="text/javascript" src="/statics/js/plugins/chartist-js/chartist.min.js"></script>
<!--sweetalert -->
<script type="text/javascript" src="/statics/js/plugins/sweetalert/sweetalert.min.js"></script>
<!--plugins.js - Some Specific JS codes for Plugin Settings-->
<script type="text/javascript" src="/statics/js/plugins.min.js"></script>
<!--custom-script.js - Add your own theme custom JS-->
<script type="text/javascript" src="/statics/js/custom-script.js"></script>
<script type="text/javascript">
    /*Show entries on click hide*/
    $(document).ready(function () {
        $(".dropdown-content.select-dropdown li").on("click", function () {
            var that = this;
            setTimeout(function () {
                if ($(that).parent().hasClass('active')) {
                    $(that).parent().removeClass('active');
                    $(that).parent().hide();
                }
            }, 100);
        });
    });
</script>
</body>

</html>